<template>
  <view class="container">
    <button @click="getWeather">获取明天天气预报</button>
    <view v-if="weatherData" class="weather-card">
      <view>日期：{{ weatherData.date }}</view>
      <view>星期：{{ weatherData.week }}</view>
      <view>最高温：{{ weatherData.high }}°C</view>
      <view>最低温：{{ weatherData.low }}°C</view>
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue';
const weatherData = ref(null);


const getWeather = () => {
  uni.request({
    url: 'http://t.weather.sojson.com/api/weather/city/101030100',
    success: (res) => {
      const data = res.data.data.forecast[1]; 
      weatherData.value = {
        date: data.date,
        week: data.week,
        high: data.high.replace('℃', ''),
        low: data.low.replace('℃', '')
      };
    },
    fail: (err) => {
      uni.showToast({ title: '请求失败', icon: 'none' });
      console.error(err);
    }
  });
};
</script>

<style scoped>
.weather-card {
  margin-top: 20rpx;
  padding: 20rpx;
  border: 1px solid #eee;
  border-radius: 9rpx;
}
</style>